<style>
table.lo * { font-size: 12px; font-family: Trebuchet MS; }
table.lo { width: 100%; }
table.lo td { vertical-align: top; text-align: left; }
table.lo td.login { width: 330px; }
table.lo td.register { width: 500px; padding-left: 5px; }
.pure_form_extra label, .pure_form_extra input { font-size: 12px !important; }
.pure_form_extra label * { font-size: 12px !important; }
.pure_form_extra select { font-size: 12px !important; }
.pure_form_extra .mandatory { color: #ff0000; padding-left: 5px; }
.pure_form_extra { background: #fff; padding: 10px; border: 1px solid #aaa; border-radius: 3px; font-size: 12px !important; }
</style>
<?php if (!isset($_SESSION['user'])) { ?>
<table class="lo" cellPadding="0" cellSpacing="0">
  <tr>
    <td class="login">
      <div class="pure-form pure-form-aligned pure_form_extra">
        <legend>登录</legend>
      
        <div class="pure-control-group">
          <label>邮箱</label>
          <input onkeyup="__login(event);" id="user" type="text" class="pure-input-1-2" placeholder="{email}" />
        </div>
        
        <div class="pure-control-group">
          <label>密码</label>
          <input onkeyup="__login(event);" id="pass" type="password" class="pure-input-1-2" placeholder="{password}" />
        </div>
        
        <div>
        <?php 
          if (isset($_SESSION['tried']) && $_SESSION['tried'] > 3) {
            require_once '../3rd_party/recaptcha/recaptchalib.php';
            echo recaptcha_get_html(RC_PUB);
          }
        ?>
        </div>
        
        <div class="pure-control-group">
          <label>&nbsp;</label>
          <button class="pure-button pure-input-1-2 pure-button-primary" onclick="login();">登录</button>
        </div>
      </div>
      <div>&nbsp;</div>
      <div id="forget" class="pure-form pure-form-aligned pure_form_extra">
        <legend>忘记密码了？</legend>
      
        <div class="pure-control-group">
          <label>邮箱</label>
          <input id="forget_user" type="text" class="pure-input-1-2" placeholder="{email}" />
        </div>
        
        <div class="pure-control-group">
          <label>&nbsp;</label>
          <button class="pure-button pure-input-1-2 pure-button-primary" onclick="reset();">重置</button>
        </div>
      </div>
    </td>
    <td class="register">
      <div id="register" class="pure-form pure-form-aligned pure_form_extra">
        <legend>没有账号?<span style="font-size: 24px; font-weight: bold;">2</span>分钟注册</legend>
      
        <div class="pure-control-group">
          <label>邮箱<span class="mandatory">*</span></label>
          <input id="reg_user" type="text" class="pure-input-1-2" placeholder="{email}" />
        </div>
        
        <div class="pure-control-group">
          <label>密码<span class="mandatory">*</span></label>
          <input id="reg_pass" type="password" class="pure-input-1-2" placeholder="{password}" />
        </div>
        
        <div class="pure-control-group">
          <label>重输密码<span class="mandatory">*</span></label>
          <input id="reg_retype" type="password" class="pure-input-1-2" placeholder="{password}" />
        </div>
        
        <div class="pure-control-group">
          <label>姓名<span class="mandatory">*</span></label>
          <input id="reg_last" type="text" placeholder="{family name}" />
          <input id="reg_first" type="text" placeholder="{given name}" />
        </div>
        
        <div class="pure-control-group">
          <label>日常居住地<span class="mandatory">*</span></label>
          <select id="living_country" class="pure-input-1-2" onchange="render();">
            <?php foreach ($LIVING_COUNTRIES as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>&nbsp;</label>
          <select id="living_area" class="pure-input-1-2"></select>
        </div>
        
        <div class="pure-control-group">
          <label>家庭收入<span class="mandatory">*</span></label>
          <select id="family_income" class="pure-input-1-2">
            <?php foreach ($FAMILY_INCOMES as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>准备购买<span class="mandatory">*</span></label>
          <select id="investment_type" class="pure-input-1-2">
            <?php foreach ($INVEST_TYPES as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>目标区域<span class="mandatory">*</span></label>
          <select id="interested_area" class="pure-input-1-2">
            <?php foreach ($NZ_AREAS as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>特别中意街道/地区</label>
          <input id="interested_area_de" type="text" class="pure-input-1-2" placeholder="{interested area}" />
        </div>
        
        <div class="pure-control-group">
          <label>房型<span class="mandatory">*</span></label>
          <select id="property_type" class="pure-input-1-2">
            <?php foreach ($HOUSE_TYPES as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>卧室数量<span class="mandatory">*</span></label>
          <select id="bedroom_num" class="pure-input-1-2">
            <?php foreach ($BDRM_NUM as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>价格区间<span class="mandatory">*</span></label>
          <select id="price_range" class="pure-input-1-2">
            <?php foreach ($PRICE_RANGE as $itm) { ?>
            <option><?php echo $itm; ?></option>
            <?php } ?>
          </select>
        </div>
        
        <div class="pure-control-group">
          <label>&nbsp;</label>
          <button class="pure-button pure-input-1-2 pure-button-primary" onclick="register();">注册</button>
        </div>
      </div>
    </td>
  </tr>
</table>
<div>&nbsp;</div>
<div>&nbsp;</div>
<script type="text/javascript">
  var __requrl = '<?php echo Utils::get_requrl($app_data); ?>';
  var __redmd = '<?php echo addslashes($app_data->sys->redmd); ?>';
  var __sys = '<?php echo addslashes($app_data->sys->php_name); ?>';
  var __id = '<?php echo $app_data->param_id; ?>';
  var __url = '<?php echo ($app_data->param_url == '') ? URL . HOME_DIR . $app_data->sys->php_name . '.php' : $app_data->param_url; ?>';
  var __err = '<?php echo ((isset($_SESSION['login_err'])) ? $_SESSION['login_err'] : ''); ?>';
  var __tried = <?php echo ((isset($_SESSION['tried'])) ? $_SESSION['tried'] : 0); ?>;
  var __cities = JSON.parse('<?php echo addslashes(json_encode($CN_CITIES)); ?>');
  var __areas = JSON.parse('<?php echo addslashes(json_encode($NZ_AREAS)); ?>');
  
  $(function(){
    if (__err != '') {
      if (window.__n) {
        window.__n.close();
      }
      window.__n = $(".cs_header").noty( {
        text : __err,
        type : 'error'
      });
    }
    if ($('#recaptcha_response_field').length > 0) {
      $('#recaptcha_response_field')[0].onkeyup = __login;
    }
    render();
  });

  function render() {
    $('#living_area').empty();
    if ($('#living_country :selected').text() == '中国') {
      arr = __cities;
    } else {
      arr = __areas;
    }
    for (var idx in arr) {
      var itm = arr[idx];
      $('#living_area').append('<option>' + itm + '</option>');
    }
  };
  
  
  function __login(ev) {
    if(ev.which == 13) {
      login();
    }
  };
  
  function reset() {
    var req = {
      user: $('#forget_user').val(),
      __id: __id
    };
    Ajax.request(
      __requrl + 'reset',
      'req=' + Utils.encodeURI(JSON.stringify(req)),
      function(rslt) {
        $('#forget').empty();
        $('#forget').append('重置密码的邮件已经发送到' + rslt.account);
      },
      null
    );
  };
  
  function login() {
    var req = {
      user: $('#user').val(),
      pass: $('#pass').val(),
    };
    if (__tried > 3) {
      req.recaptcha_challenge_field = $('#recaptcha_challenge_field').val();
      req.recaptcha_response_field = $('#recaptcha_response_field').val();
    }
    Ajax.request(
      __requrl + 'login',
      'req=' + Utils.encodeURI(JSON.stringify(req)),
      function(rslt) {
        if (!rslt.err) {
          $.blockUI({ message: '<div style="font-size: 12px; padding: 5px 0; font-weight: bold;">登陆成功，转入页面...</div>' });
          if (parent != window) {
            parent.location.href = __url;
          } else {
            location.href = __url;
          }
        } else {
          if (rslt.tried > 3) {
            if (parent != window) {
              parent.location.reload();
            } else {
              location.reload();
            }
          } else {
            if (window.__n) {
              window.__n.close();
            }
            window.__n = $(".cs_header").noty( {
              text : rslt.err,
              type : 'error'
            });
          }
        } 
      },
      null
    );
  };

  function register() {
    var req = {
      account: $('#reg_user').val(),
      password: $('#reg_pass').val(),
      __retype: $('#reg_retype').val(),
      first_name: $('#reg_first').val(),
      last_name: $('#reg_last').val(),
      living_country: $('#living_country :selected').text(),
      living_area: $('#living_area :selected').text(),
      family_income: $('#family_income :selected').text(),
      investment_type: $('#investment_type :selected').text(),
      interested_area: $('#interested_area :selected').text(),
      interested_area_de: $('#interested_area_de').val(),
      property_type: $('#property_type :selected').text(),
      bedroom_num: $('#bedroom_num :selected').text(),
      price_range: $('#price_range :selected').text(),
      __id: __id
    };
    Ajax.request(
      __requrl + 'register',
      'req=' + Utils.encodeURI(JSON.stringify(req)),
      function(rslt) {
        $('#register').empty();
        $('#register').append('激活邮件已经发送到' + rslt.account + ', 赶紧去激活账号吧！');
      },
      null
    );
  };
</script>
<?php } else { ?>
<div class="pure-form pure-form-aligned pure_form_extra">已登录, 跳转页面...</div>
<script type="text/javascript">
var __url = '<?php echo ($app_data->param_url == '') ? URL . HOME_DIR : $app_data->param_url; ?>';
if (parent != window) {
  parent.location.href = __url;
} else {
  location.href = __url;
}
</script>
<?php } ?>